Web Application Makeover: How to use custom fonts and @font-face | Episode 6
Description
Chris Coyier and I discuss how to use custom fonts and @font-face to makeover your web application or site. Chris and I also discuss "What is a front-end developer" and contrast his project codepen.io with jsfiddle.net and jsbin.com.
Chris has worked for large scale web apps like SurveyMonkey and design focused startups like Wufoo. He co-founded CodePen, an online playground for HTML, CSS, and JavaScript. Chris also has a weekly podcast about all things web with Dave Rupert called ShopTalk. The man knows a few things about the web!
To subscribe to the podcast, please use the links below:
Click Here to Subscribe via iTunes
Click Here to Subscribe via RSS (non-iTunes feed)
Show Notes:
Resources
Chris's CSS blog CSS Tricks
Codepen
Adobe TypeKit
Font Squirrel
Font Squirrel's Font Generator
Also mentioned Sifr
Full Transcript
Craig McKeachie: [0:00 ] On this episode, Chris Coyier discusses how to use custom fonts, and @font-face to makeover your web application. This is Front End Developer Cast, Episode 6.
[0:09 ] [music]
Craig: [0:20 ] Welcome to The Front End Developer Cast, the podcast that helps developers be awesome at building ambitious web applications, whether you're a JavaScript ninja, or you're just getting started. I'm your host, Craig McKeachie.
[0:33 ] Hi, everyone. My interview today is with Chris Coyier of csstricks.com, and the creator of codepen.io. Let's get right into the interview.
[0:42 ] Hi, today, I'm really lucky to have Chris Coyier, of csstricks and codepen fame on the podcast. We can talk a little bit more about his background. It's somewhat unclear to me, I'd be interested for Chris to fill in some of the details. I know you used to work at SurveyMonkey, and then SurveyMonkey was bought by Wufoo, if you wouldn't mind, Chris, welcome to the podcast and give us a little history about yourself.
Chris Coyier: [1:05 ] Thanks for having me. It's awesome to be on. It actually worked in that reverse order.
[1:10 ] It was Wufoo that got bought by SurveyMonkey. That's the first time that's happened. I feel like most people...I can grab somebody off the street usually that's heard of SurveyMonkey, because I feel like they've been around forever, and they have market saturation, and teachers use it and stuff like that, whereas, Wufoo is a little more niched to the industry.
Craig: [1:32 ] It makes sense that SurveyMonkey would be the acquirer, right? Yes, definitely.
Chris: [1:36 ] Yes. My history is tremendously boring. I don't know, there's not much that can be gleaned out of it! I hate to start on a bummer note like that, but it's like I'm just normal kid who went to normal college in the Midwest in the US, and became a font-end developer.
Craig: [1:55 ] It's CSS Tricks, I saw you're listed as an author for that. Did that start as your blog and is now owned by Treehouse? Can you give me a little [inaudible 0:02:04 ] ? People are curious about that a little bit.
Chris: [2:03 ] Sure. That's probably what most people know me from in this industry, because it's the thing I've been doing the longest.
[2:11 ] It tends to be one of those sites that people tell me it shows up in search results a lot when you Google a CSS problem or something like that. Google has been good to me in that way. That's a blog that I started in 2007, it's a little over seven-years- old now.
[2:30 ] There's screencasts on it and a blog post, and a section I call Snippets, where I have little miniature chunks of code that have less explanation attached to them, and there's a community forums there that's pretty active, and stuff, it's this whole site about all things front-end web design. It's called CSS Tricks, which is a terribly hokey name, but it has brand power over the thing.
[2:54 ] It's not owned by Treehouse. Treehouse is a sponsor of mine and I have an interactive ...